<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Proxy+Reflect2</title>
</head>
<style>
  body {
    padding: 24px;
  }

  .code-box {
    width: 600px;
    margin: auto;
  }

  .excute-box {
    width: 600px;
    margin: 12px auto;
  }

  .output-box {
    width: 600px;
    margin: auto;
  }
</style>

<body>
  <div class="code-box">
    代码
    <pre>
      function main() {
        function sum(a, b) {
          return a + b;
        }
    
        const handle1 = {
          apply: function (target, thisArg, argumentsList) {
            console.log(`Calculate sum: ${argumentsList}`);
            // Expected output: "Calculate sum: 1,2"
    
            return target.call(thisArg, ...argumentsList) * 10;
          },
        }
        const proxy1 = new Proxy(sum, handle1);
    
        console.log(sum(1, 2));
    
        // Expected output: 3
        console.log(proxy1(1, 2));
        // Expected output: 30
      }
      const elRun = document.getElementsByClassName('btn-run')[0];
      elRun.addEventListener('click', main)
    </pre>
  </div>
  <div class="excute-box">
    <button class="btn-run">运行</button>
  </div>
  <div class="output-box">
    <textarea id="log" rows="10" cols="80"></textarea>
  </div>
</body>
<script>
  function main() {
    function sum(a, b) {
      return a + b;
    }

    const handle1 = {
      apply: function (target, thisArg, argumentsList) {
        console.log(`Calculate sum: ${argumentsList}`);
        // Expected output: "Calculate sum: 1,2"

        return target.call(thisArg, ...argumentsList) * 10;
      },
    }
    const proxy1 = new Proxy(sum, handle1);
    let output = ''
    // console.log(sum(1, 2));
    output += sum(1, 1) + '\n';
    // Expected output: 3
    output += proxy1(1, 1) + '\n';
    document.getElementById('log').value = output;
    // console.log(proxy1(1, 2));
    // Expected output: 30
  }
  const elRun = document.getElementsByClassName('btn-run')[0];
  elRun.addEventListener('click', main)
</script>

</html>